<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="ch">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" th:href="@{/static/layui/css/layui.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/static/css/userInfo/relgoods.css}"/>
    <script type="text/javascript" th:src="@{/static/layui/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/static/js/vue.js}"></script>
    <script type="text/javascript" th:src="@{/static/js/userInfo/ckplayer.js}"></script>
    <title>游戏道具交易商城 | 发布商品</title>
    <script th:inline="javascript">
        var basePath = [[${#httpServletRequest.getScheme() + "://" + #httpServletRequest.getServerName() + ":" + #httpServletRequest.getServerPort() + #httpServletRequest.getContextPath()}]];
    </script>
</head>
<body style="background-color:white">
<form class="layui-form" id="goodsform" style="margin-top: 10px">
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red">*</span>商品名称</label>
        <div class="layui-input-block">
            <input type="text" name="commname" lay-verify="required" autocomplete="off" placeholder="请输入商品名称"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label"><span style="color: red">*</span>商品描述</label>
        <div class="layui-input-block">
            <textarea placeholder="请输入商品描述" name="commdesc" lay-verify="required" autocomplete="off"
                      class="layui-textarea"></textarea>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">商品视频</label>
        <div class="layui-inline">
            <button type="button" class="layui-btn" id="test1">上传视频</button>
        </div>
    </div>
    <div class="videosamplex" id="videosamplex" style="width:600px;height:400px;margin-left:100px;margin-bottom:15px;display: none">
        <video id="videoplayer"></video>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">商品原价</label>
        <div class="layui-input-block">
            <input type="number" name="orimoney" autocomplete="off" placeholder="请输入商品原价"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label"><span style="color: red">*</span>商品售价</label>
        <div class="layui-input-block">
            <input type="number" name="thinkmoney" lay-verify="required" autocomplete="off" placeholder="请输入商品售价"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red">*</span>商品类别</label>
        <div class="layui-input-block">
            <select name="category" lay-filter="required">
                <option value="游戏币" selected="">游戏币</option>
                <option value="道具类">道具类</option>
                <option value="装备类">装备类</option>
                <option value="宠物类">宠物类</option>
                <option value="游戏帐号">游戏帐号</option>
                <option value="代练服务">代练服务</option>
                <option value="其他">其他</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red">*</span>常用选项</label>
        <div class="layui-input-block">
            <input type="radio" name="common" value="不议价" title="不议价" checked="">
            <input type="radio" name="common" value="可小刀" title="可小刀">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red">*</span>商品主图</label>
        <div class="layui-inline">
            <button type="button" class="layui-btn" id="test2">上传主图</button>
        </div>
    </div>
    <div id="mainimage" style="display: none;margin-left:100px;margin-bottom:10px">
        <img :src="mainimg" style="width:300px;height:200px;cursor: pointer" id="imageurl"
             @click="openimg(mainimg)">
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span style="color: red">*</span>商品其他图</label>
        <div class="layui-inline">
            <button type="button" class="layui-btn" id="test3">上传其他图（最多3张）</button>
        </div>
    </div>
    <div id="otherimages" style="margin-top:0px;display: none;margin-left:100px;margin-bottom:10px">
        <div class="imgDiv" v-for="(img,index) in listimages"
             :key="index" :id="'img'+index" @mouseover="mouseOver(index)" @mouseleave="mouseLeave(index)">
            <img :src="img.imgsrc" style="width:300px;height:200px;cursor: pointer"
                 @click="openimg(img.imgsrc)">
            <img th:src="@{/static/images/close.png}" class="delete"
                 @click="delimage(index)" :id="'del'+index" style="cursor: pointer">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"></label>
        <div class="layui-input-block" style="color:#C62F2F">
            <p>温馨提示：请勿发布涉及政治、广告、营销、违反国家法律法规等商品。</p>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit="" id="demo1" lay-filter="demo1">立即提交</button>
        </div>
    </div>
</form>
</body>
<script type="text/javascript" th:src="@{/static/layui/layui.js}"></script>
<script type="text/javascript" th:src="@{/static/js/userInfo/relgoods.js}"></script>
</html>